<script setup>
/**
 * 推荐页面子组件
 */
import "../../assets/Recommend/iconfont.css"
defineProps({
  id:Number,
  title:String,
  content:String,
  likeCount:Number,
  user:{
    id:Number,
    name:String,
  },
  commentNum:Number,
  getList:Object
})
</script>

<template>
  <div>
    <div >
      <div style="display: inline-block">
        <img class="recommend-headerImg" style="border-radius: 30px" src="../../assets/Recommend/ms.webp" alt="" width="40" height="40">
        <span>{{user.name}}</span>
      </div>
      <div style="float: right;display: inline-block">
        <i class="iconfont icon-sangedian"></i>
      </div>
    </div>
    <h3>{{ title }}</h3>
    <p class="content">{{ content }}</p>
    <div class="">
      <img src="../../assets/Recommend/ms.webp" alt="" class="col-4">
    </div>
    <div>
      <div style="display: inline-block">
        <span v-for="(list,index) in getList" :key="index">
          <span>{{list.type}}</span>
        </span>
      </div>
      <div style="float: right;display: inline-block">
        <span>
          <i class="iconfont icon-pinglun2"></i>
          <span>{{ commentNum }}</span>
        </span>
        <span>
          <i class="iconfont icon-dianzan_kuai"></i>
          <span>{{ likeCount }}</span>
        </span>
      </div>
    </div>
  </div>
</template>
<style scoped>
.icon-sangedian{
  font-size: 20px;
}
.content{
  line-height: 20px;
}
</style>